<template>
  <div class='app-container'>
    resizable
    <div class="box"></div>
    <div class="vxe-resizable" v-resizable></div>
  </div>
</template>

<script>
export default {
  data() {
    return {};
  },

  components: {},

  computed: {},

  mounted() {},

  watch: {
    value: {
      handler(val) {},
      deep: true,
      immediate: true,
    },
  },

  methods: {},
};
</script>

<style scoped lang='scss'>
.app-container {
  height: 100%;
  width: 400px;
  position: relative;
}
.box {
  height: 100%;
  width: 400px;
  border: 2px solid #ccc;
  padding: 0 10px;
}
.vxe-resizable {
  position: absolute;
  right: -7px;
  bottom: 0;
  width: 14px;
  height: 100%;
  text-align: center;
  z-index: 1;
  cursor: col-resize;
}
</style>